<template>
  <div class="salarys-container">
    <div class="app-container">
      <h2>
        工资 {{ num }}
      </h2>
      <!-- <son :value="msg" @input="changeMsg" /> -->
      <!-- v-model 就是使用 :value+@input 组合来的, 就可以在组件上使用v-model了
       1. 组件上使用v-model 子组件内接收的数据必须是value
       2. 子传父自定义事件必须叫 input自定义事件
       在组件传值的时候, 如果只传递一个值  v-model可以搞定
       -->
      <!-- <son v-model="msg" :num="num" @changeNum="changeNum" /> -->
      <!-- 父传子 :属性名.sync = "数据"
           子组件在props中接收
           子组件要修改父组件的数据  子组件通知父组件自定义事件名 this.$emit('update:属性', 值 )
           不需要在父组件的位置绑定自定义事件了
      -->
      <son :msg.sync="msg" :num.sync="num" />
    </div>
  </div>
</template>

<script>
import Son from './Son.vue'
export default {
  name: 'Salarys',
  components: { Son },
  data() {
    return {
      msg: 'hahaha',
      num: 100
    }
  },
  methods: {
    // changeMsg(str) {
    //   this.msg = str
    // },
    // changeNum(num) {
    //   this.num = num
    // }
  }
}
</script>

<style>

</style>
